<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>品优购</title>
    <link rel="shortcut icon" href=" bitbug_favicon.ico">
    <link rel="stylesheet" href="index.css">
    <link rel="stylesheet" href="common.css">
</head>

<body>
    <!-- 快捷导航模块 -->
    <section class="shortcut">

        <div class="w">
            <!-- 登录注册 -->
            <div class="fl">
                品优购欢迎您！ 请<a href="登录.html" style="color:blue">登录</a>或 &nbsp;
                <a href="注册.html" class="zc" target="_blank">免费注册</a>
            </div>
            <div class="fr">
                <p><a href="提交订单.html">我的订单</a></p>
                <span>|</span>
                <ul>
                    <li>我的品优购<i class="iconfont">&#xe631;</i></li>

                    <li>我的品优购</li>
                    <li>我的品优购</li>
                </ul>
                <span>|</span>
                <p>品优购会员</p>
                <span>|</span>
                <p>企业采购</p>
                <span>|</span>
                <ul>
                    <li>关注品优购<i class="iconfont">&#xe631;</i></li>
                    <li>关注品优购</li>
                    <li>关注品优购</li>
                </ul>
                <span>|</span>
                <ul>
                    <li>客户服务<i class="iconfont">&#xe631;</i></li>
                    <li>客户服务</li>
                    <li>客户服务</li>
                </ul>
                <span>|</span>
                <ul>
                    <li>网站导航<i class="iconfont">&#xe631;</i></li>
                    <li>网站导航</li>
                    <li>网站导航</li>
                </ul>
            </div>
        </div>
    </section>
    <div class="header">
        <a href="#" ><img src="images/logo.png" alt=""></a>
        <div class="search">
            <input type="search" placeholder="搜索内容">
            <button>搜索</button>
        </div>
        <div class="car">
            <a href="购物车结算.html" target="_blank">
                <img src="images/购物车.png" alt="" class="gwc">
                我的购物车
                <i class="iconfont">&#xe630;</i>
            </a>
                
            <img src="images/购物数量.png" alt="" class="gwsl">
        </div>
        <div class="hotwords">
            <a href="">优惠购首发</a>
            <a href="">亿元优惠</a>
            <a href="">9.9元团购</a>
            <a href="">美满99减30</a>
            <a href="">办公用品</a>
            <a href="">电脑</a>
            <a href="">通信</a>
        </div>
    </div>
    <div class="nav">
        <span>全部商品分类</span>
        <a href="">服装城</a>
        <a href="">服装城</a>
        <a href="">服装城</a>
        <a href="">服装城</a>
        <a href="">服装城</a>
        <a href="">服装城</a>
        <a href="">服装城</a>
        <a href="">服装城</a><br>
        <div class="shop">
            <a href="#">家用电器<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="商品详情页.html">手机、数码、通信<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">电脑、办公<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">家居、家具、家装、厨具<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">男装、女装、童装、内衣<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">个户化妆、清洁用品、宠物<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">鞋靴、箱包、珠宝、奢侈品<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">运动户外、钟表<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">汽车、汽车用品<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">母婴、玩具乐器<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">食品、酒类、生鲜、特产<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">医药保健<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">图书、音像、电子书<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">彩票、旅行、充值、票务<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            <a href="#">理财、众筹、白条、保险<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
        </div>
    </div>
    <div class="middle">
        <div class="focus">
            <img src="images/大图2.jpg" alt="">
        </div>
        <div class="newsflash">
            <div class="newhead">
                <span>品优购快报</span>
                <a href="">更多<i class="iconfont" style="font-size: 12px;">&#xe630;</i></a>
            </div>
            <div class="news">
                <a href=""><strong>[重磅] </strong>它来了它来了，最帅的人走来了, 它是谁？</a>
                <a href=""><strong>[重磅] </strong>它来了它来了，最帅的人走来了, 它是谁？</a>
                <a href=""><strong>[重磅] </strong>它来了它来了，最帅的人走来了, 它是谁？</a>
                <a href=""><strong>[重磅] </strong>它来了它来了，最帅的人走来了, 它是谁？</a>
                <a href=""><strong>[重磅] </strong>它来了它来了，最帅的人走来了, 它是谁？</a>
            </div>
            <div class="life">
                <span><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span class="four"><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span class="eight"><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span class="nine"><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span class="ten"><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span class="eleven"><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
                <span class="twelve"><i class="iconfont" style="font-size: 12px;">&#xe613;</i>话费</span>
            </div>
        </div>
        <div class="fixed">
            <p class="first">快捷导航</p>
            <p><a href="#one">家用电器</a></p>
            <p><a href="#two">电脑办公</a></p>
            <p><a href="#three">手机通讯</a></p>
            <p><a href="#">电脑办公</a></p>
            <p><a href="#">电脑办公</a></p>
            <p><a href="#">电脑办公</a></p>
            <p><a href="#">电脑办公</a></p>
            <p><a href="#">电脑办公</a></p>
            <p><a href="#">电脑办公</a></p>
            <p><a href="#">电脑办公</a></p>
        </div>
    </div>
    <div class="recom">
        <p><i class="iconfont">&#xe613;</i>今日推荐</p>
        <div class="lrecom">
            <span class="one"><img src="images/今日推荐.png"></span>
            <span><img src="images/今日推荐.png"></span>
            <span><img src="images/今日推荐.png"></span>
            <span><img src="images/今日推荐.png"></span>
        </div>
    </div>
    <div class="box_hd">
        <span id="one">家用电器</span>
        <div class="right">
            <a href="">热门</a>|
            <a href="">大家电</a>|
            <a href="">生活电器</a>|
            <a href="">厨房电器</a>|
            <a href="">生活电器</a>|
            <a href="">个护健康</a>|
            <a href="">应季电器</a>|
            <a href="">空气/净水</a>|
            <a href="">新奇特</a>|
            <a href="">高端电器</a>
        </div>
    </div>
    <div class="floor">
        <div class="fleft">
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <div class="flimg1">
                <img src="images/手机.png" alt="">
            </div>
        </div>
        <div class="flimg2">
            <img src="images/手机2.png" alt="">
        </div>
        <div class="fleft2">
            <img src="images/手机3.png" alt="">
        </div>
        <div class="fleft3">
            <img src="images/手机4.png" alt="">
        </div>
        <div class="fleft4">
            <img src="images/手机5.png" alt="">
        </div>
    </div>
    <div class="zanzhu">
        <img src="images/手机6.png" alt="" class="first">
        <img src="images/手机6.png" alt="">
        <img src="images/手机6.png" alt="">
        <img src="images/手机6.png" alt="">
        <img src="images/手机6.png" alt="">
        <img src="images/手机6.png" alt="">
        <img src="images/手机6.png" alt="">
        <img src="images/手机6.png" alt="">
        <img src="images/手机6.png" alt="">
        <img src="images/手机6.png" alt="" class="last">
    </div>
    <div class="box_hd">
        <span id="two">电脑办公</span>
        <div class="right">
            <a href="">热门</a>|
            <a href="">大家电</a>|
            <a href="">生活电器</a>|
            <a href="">厨房电器</a>|
            <a href="">生活电器</a>|
            <a href="">个护健康</a>|
            <a href="">应季电器</a>|
            <a href="">空气/净水</a>|
            <a href="">新奇特</a>|
            <a href="">高端电器</a>
        </div>
    </div>
    <div class="floor">
        <div class="fleft">
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <div class="flimg1">
                <img src="images/手机.png" alt="">
            </div>
        </div>
        <div class="flimg2">
            <img src="images/手机2.png" alt="">
        </div>
        <div class="fleft2">
            <img src="images/手机3.png" alt="">
        </div>
        <div class="fleft3">
            <img src="images/手机4.png" alt="">
        </div>
        <div class="fleft4">
            <img src="images/手机5.png" alt="">
        </div>
    </div>
    <div class="box_hd">
        <span id="three">手机通讯</span>
        <div class="right">
            <a href="">热门</a>|
            <a href="">大家电</a>|
            <a href="">生活电器</a>|
            <a href="">厨房电器</a>|
            <a href="">生活电器</a>|
            <a href="">个护健康</a>|
            <a href="">应季电器</a>|
            <a href="">空气/净水</a>|
            <a href="">新奇特</a>|
            <a href="">高端电器</a>
        </div>
    </div>
    <div class="floor">
        <div class="fleft">
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <span><a href="">节能补贴</a></span>
            <div class="flimg1">
                <img src="images/手机.png" alt="">
            </div>
        </div>
        <div class="flimg2">
            <img src="images/手机2.png" alt="">
        </div>
        <div class="fleft2">
            <img src="images/手机3.png" alt="">
        </div>
        <div class="fleft3">
            <img src="images/手机4.png" alt="">
        </div>
        <div class="fleft4">
            <img src="images/手机5.png" alt="">
        </div>
    </div>
    <footer>
        <div class="footer">
            <div class="up">
                <span>                   
                    <img src="images/正.png" alt="">
                    <h4>正品保障</h4>
                    <p>正品保障,提供发票</p>
                </span>
                <span>
                    <img src="images/正.png" alt="">
                    <h4>正品保障</h4>
                    <p>正品保障,提供发票</p>
                </span>
                <span>
                    <img src="images/正.png" alt="">
                    <h4>正品保障</h4>
                    <p>正品保障,提供发票</p>
                </span>
                <span>
                    <img src="images/正.png" alt="">
                    <h4>正品保障</h4>
                    <p>正品保障,提供发票</p>
                </span>
            </div>
            <div class="down">
                <dl>
                    <dt>服务指南</dt>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">会员介绍</a></dd>
                    <dd><a href="#">生活旅行/团购</a></dd>
                    <dd><a href="#">常见问题</a></dd>
                    <dd><a href="#">大家电</a></dd>
                    <dd><a href="#">联系客服</a></dd>
                </dl>
                <dl>
                    <dt>服务指南</dt>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">会员介绍</a></dd>
                    <dd><a href="#">生活旅行/团购</a></dd>
                    <dd><a href="#">常见问题</a></dd>
                    <dd><a href="#">大家电</a></dd>
                    <dd><a href="#">联系客服</a></dd>
                </dl>
                <dl>
                    <dt>服务指南</dt>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">会员介绍</a></dd>
                    <dd><a href="#">生活旅行/团购</a></dd>
                    <dd><a href="#">常见问题</a></dd>
                    <dd><a href="#">大家电</a></dd>
                    <dd><a href="#">联系客服</a></dd>
                </dl>
                <dl>
                    <dt>服务指南</dt>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">会员介绍</a></dd>
                    <dd><a href="#">生活旅行/团购</a></dd>
                    <dd><a href="#">常见问题</a></dd>
                    <dd><a href="#">大家电</a></dd>
                    <dd><a href="#">联系客服</a></dd>
                </dl>
                <dl>
                    <dt>服务指南</dt>
                    <dd><a href="#">购物流程</a></dd>
                    <dd><a href="#">会员介绍</a></dd>
                    <dd><a href="#">生活旅行/团购</a></dd>
                    <dd><a href="#">常见问题</a></dd>
                    <dd><a href="#">大家电</a></dd>
                    <dd><a href="#">联系客服</a></dd>
                </dl>
                <dl class="last">
                    <dt><a href="#">帮助中心</a></dt>
                    <img src="images/二维码.png" alt="">
                    <dd><a href="#">品优购客户端</a></dd>
                </dl>
            </div>
            <div class="btup">
                <p><a href="#">关于我们</a></p>
                <p>|</p>
                <p><a href="#">联系我们</a></p>
                <p>|</p>
                <p><a href="#">联系客服</a></p>
                <p>|</p>
                <p><a href="#">商家入驻</a></p>
                <p>|</p>
                <p><a href="#">营销中心</a></p>
                <p>|</p>
                <p><a href="#">手机品优购</a></p>
                <p>|</p>
                <p><a href="#">友情链接</a></p>
                <p>|</p>
                <p><a href="#">销售联盟</a></p>
                <p>|</p>
                <p><a href="#">品优购社区</a></p>
                <p>|</p>
                <p><a href="#">品优购公益</a></p>
                <p>|</p>
                <p><a href="#">English Site</a></p>
                <p>|</p>
                <p><a href="#">Contact U</a></p>
            </div>
            <div class="btdw">
                地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn<br>
                京ICP备08001421号京公网安备110108007702
            </div>
    </footer>
</body>

</html>
